<template>

	<view class="index-box">

		<!-- 描述标题，下载按钮，主界面 -->
		<view class="top-box">

			<view class="top-box-title">
				<image class="top-box-logo" src="../../static/ic_launcher.png"></image>
				<text class="top-box-name">成语大富豪</text>
			</view>

			<view class="down-load-desc" v-show="isShowTip">
				<view class="down-load-desc-content">
					<text>请转至浏览器下载</text> <text class="btn-copy" hover-class="button-hover" hover-start-time="20"
						hover-stay-time="70" @click="copyLink()">复制网址</text>
				</view>

			</view>

			<button class="top-box-title-down" type="primary" @click="playpapers(downUrl)">

				<uni-icons type="download" color="#FFFFFF" size="20" style="margin-right: 20rpx;"></uni-icons>
				<text>Android 下载</text>

			</button>

		</view>

		<view>
			<item-desc :desc="top"></item-desc>
		</view>


		<!-- 主界面 -->
		<view>
			<item-desc v-for="(item,index) in descList" :key="index" :desc="item"></item-desc>
		</view>

		<!-- 底部，下载按钮，主界面 -->
		<view class="top-box">

			<item-desc :desc="bottom"></item-desc>

			<button class="top-box-title-down" type="primary" @click="playpapers(downUrl)">

				<uni-icons type="download" color="#FFFFFF" size="20" style="margin-right: 20rpx;"></uni-icons>
				<text>Android 下载</text>

			</button>



		</view>

	</view>

</template>

<script>
	import itemDesc from '@/components/item-desc.vue';

	import {
		Base64
	} from '@/js_sdk/js-base64/base64.min.js';

	import clipboard from '@/js/clipboard.js';

	import {
		http
	} from '@/js/http.js';


	export default {
		components: {
			"item-desc": itemDesc
		},
		created() {

			// 获取query对象
			// var query = this.$route.query;
			// // 获取code参数
			// var link = query.link;

			// this.downUrl = Base64.decode(link);
			// console.log(this.downUrl);

			let pages = getCurrentPages() //页面列表
			console.log("pages: "+pages);
			let page = pages[pages.length - 1].$page; //路由名称
			// var link = page.split('link=')[1] //split切割获得想要的字段 
			console.log(page.options.link);
			if (page.options) {
				if (page.options.link) {
					console.log("link: "+Base64.decode(page.options.link));
					this.downUrl = Base64.decode(page.options.link);
				}
			}

		},
		onLoad(e) {
			// let query = e;
			// if (query.hasOwnProperty('link')) {
			// 	this.link = query.link;
			// 	this.downUrl = Base64.decode(link);
			// }
		},
		data() {
			return {
				isShowTip: false,
				downUrl: "",
				top: {
					title: "【玩游戏,赚零花】",
					desc: "奖励直接到账",
					img: require('@/static/1.jpg')
				},
				bottom: {
					title: "【推荐好友】",
					desc: "阶梯奖励,最高3元",
					img: require('@/static/2.jpg')
				},
				descList: [{
					title: "【提现】",
					desc: "等级越高,提现越简单~",
					img: require('@/static/3.jpg')
				}]
			}
		},
		onLoad() {
			// #ifdef H5
			let ua = window.navigator.userAgent.toLowerCase()
			if (ua.match(/MicroMessenger/i) == 'micromessenger') {
				// do something
				this.isShowTip = true;
			} else {
				this.isShowTip = false;
			}
			// #endif
		},

		methods: {

			playpapers(url) {

				// #ifdef H5
				let ua = window.navigator.userAgent.toLowerCase()
				if (ua.match(/MicroMessenger/i) == 'micromessenger') {
					// do something

					let that = this;
					uni.showToast({

						title: "请复制网址至浏览器后重试",
						duration: 3000,
						icon: "none"
					});

				} else {
					let dload = document.createElement("a");

					dload.download = ''; // 设置下载的文件名，默认是'下载'

					dload.href = url;

					document.body.appendChild(dload);

					dload.click();

					dload.remove(); // 下载之后把创建的元素删除

					uni.showToast({

						title: "请点击普通下载",
						duration: 3000,
						icon: "loading"

					});
				}
				// #endif


			},
			copyLink() {

				uni.setClipboardData({
					data: location.href,
					success: function() {
						// 重点~做笔记
						uni.showToast({
							title: '网址已复制',
							duration: 2500,
							icon: 'none'
						});

					},
					fail: function(err) {
						uni.showToast({
							title: '复制失败',
							duration: 2500,
							icon: 'none'
						});
					}
				})

			}
		}
	}
</script>

<style lang="scss" scoped>
	.index-box {
		display: flex;
		flex-direction: column;
		width: 100%;
		padding: 10rpx;
		box-sizing: border-box;

		.top-box {
			display: flex;
			flex-direction: column;
			width: 100%;
			box-sizing: border-box;

			.top-box-title {
				flex-direction: column;
				margin: 40px auto;
				display: flex;
				align-items: center;

				.top-box-logo {
					width: 128rpx;
					height: 128rpx;
					margin-bottom: 10rpx;
				}

				.top-box-name {
					font-size: 60rpx;
					font-family: "arial,sans-serif";
				}
			}

			.down-load-desc {
				display: flex;
				align-items: center;
				justify-content: center;

				.down-load-desc-content {
					display: flex;
					align-items: center;
					justify-content: center;

					.btn-copy {
						margin-left: 20rpx;
						color: #0094ff;
					}
				}

			}

			.top-box-title-down {
				margin: 10px auto;
				width: 60%;
				padding: 10rpx;

			}
		}

	}
</style>
